*{
    margin: 0;
    padding: 0;
    list-style: none;
}
body{
    background-color: rgb(234,65,40);
    .box{
        width: 1200px;
        header{
            width: 100%;
            height: 45px;
            background-color: rgb(245,245,245);
            padding: 0 250px 0;
            color: rgb(117, 117, 117);
            .top-left{
                float: left;
                height: 100%;
                li{
                    float: left;
                    height: 45px;
                    font-size: 12px;
                    line-height: 45px;
                    margin-right: 20px;
                    i{
                        display: inline-block;
                        width: 16px;
                        height: 11px;
                        background: url('../img/下箭头.png') no-repeat;


                    }
                }
                .red{
                    color: red;
                }
            }
            .top-right{
                float: right;
                height: 100%;
                li{
                    float: left;
                    height: 45px;
                    font-size: 12px;
                    line-height: 45px;
                    margin-right: 20px;
                    .car{
                        display: block;
                        float: left;
                        width: 18px;
                        height: 20px;
                        margin-top: 10px;
                        background: url('../img/car.png') no-repeat;
                        
                    }
                }
            }
        }
        main{
            width: 1200px;
            overflow: hidden;
            background-color: white;
            margin-top: 80px;
            margin-left: 250px;
            border-radius: 20px;
            .box1{
                width: 100%;
                // height: 130px;
                padding: 20px 30px;
                float: left;
                overflow: hidden;
                .logo{
                    width: 130px;
                    height: 90px;
                    background: url('../img/p2.png') no-repeat -15px -66px;
                    float: left;
                    margin-left: 20px;
                }
                .search{
                    width: 650px;
                    // height: 100px;
                    // border: 1px solid red;
                    float: left;
                    margin-top: 20px;
                    margin-left: 100px;
                    position: relative;
                    overflow: hidden;
                    #baobei{
                        width: 100px;
                        height: 50px;
                        border: 1px solid rgb(255,80,0);
                        border-radius: 30px 0 0 30px;
                        border-right-color: rgb(194, 194, 194);
                        text-align: center;
                        float: left;
                    }
                    #search{
                        width: 500px;
                        height: 52px;
                        border: 1px solid rgb(255,80,0);
                        border-left: none;
                        float: left;
                        border-radius: 0 30px 30px 0;
                        padding-left: 25px;
                        background: url('../img/search.png') no-repeat left 15px;
                    }
                    .btnSearch{
                        position: absolute;
                        width: 80px;
                        height: 45px;
                        color: white;
                        background-color: rgb(255,111,0);
                        border-radius: 30px;
                        text-align: center;
                        line-height: 45px;
                        font-size: 18px;
                        top: 3px;
                        left: 518px;
                    }
                    .camera{
                        position: absolute;
                        width: 37px;
                        height: 31px;
                        background: url('../img/camera.png') no-repeat;
                        top: 10px;
                        left: 470px;
                    }
                    ul{
                        width: 100%;
                        height: 20px;
                        margin-top: 5px;
                        float: left;
                        li{
                            float: left;
                            font-size: 12px;
                            margin-right: 5px;
                            color: gray;
                        }
                    }
                }
                .erweima{
                    width: 95px;
                    height: 112px;
                    background: url('../img/erweima.png') no-repeat;
                    float: right;
                    margin-right: 50px;
                }
            }
            nav{
                float: left;
                width: 100%;
                p{
                    color: rgb(255,98,0);
                    font-size: 18px;
                    width: 200px;
                    text-align: center;
                    float: left;
                }
                ul{
                    float: left;
                    margin-left: 50px;
                    li{
                        float: left;
                        margin-right: 30px;
                        font-size: 18px;
                        font-weight: normal;
                    }
                }
            }
            .box2{
                width: 100%;
                float: left;
                margin-top: 30px;
                display: flex;
                ul{
                    width: 200px;
                    height: 500px;
                    // background-color: yellowgreen;
                    text-align: center;
                    flex: 1;
                    li{
                        height: 30px;
                        line-height: 30px;
                        color: gray;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                        a{
                            margin-right: 5px;
                            margin-left: 5px;
                            overflow: hidden;
                            white-space: nowrap;
                            text-overflow: ellipsis;
                        }
                        span{
                            float: right;
                        }
                    }
                }
                .pic{
                    flex: 3;
                    display: flex;
                    flex-direction: column;
                    margin-left: 20px;
                    .pic1{
                        flex: 4;
                        border-radius: 20px;
                        background-color: pink;
                    }
                    .pic2{
                        flex: 3;
                        .pic2-1{
                            width: 100%;
                            height: 25px;
                            background: url('../img/tianmao.png') no-repeat;
                        }
                        .pic2-2{
                            width: 100%;
                            height: 180px;
                            background-color: skyblue;
                            border-radius: 20px;
                        }
                    }
                    // background-color: greenyellow;
                }
                .box1-1{
                    flex: 2;
                    // background-color: pink;
                    display: flex;
                    flex-direction: column;
                    margin-left: 20px;
                    .box1-1-top{
                        flex: 4;
                        .top1{
                            width: 351px;
                            height: 120px;
                            background: url('../img/Hi.png') no-repeat;
                            margin-bottom: 5px;
                        }
                        .top2{
                            width: 351px;
                            height: 25px;
                            .top2-1,.top2-2,.top2-3{
                                width: 100px;
                                height: 25px;
                                color: white;
                                background-color: rgb(255,89,1);
                                border-radius: 5px;
                                text-align: center;
                                line-height: 25px;
                                margin-left: 10px;
                                float: left;
                            }
                        }
                        .top3{
                            width: 351px;
                            height: 83px;
                            background: url('../img/share.png') no-repeat;
                        }
                        .top4{
                            width: 351px;
                            ul{
                                width: 351px;
                                height: 30px;
                                float: left;
                                li{
                                    float: left;
                                    width: 35px;
                                    text-align: center;
                                    height: 30px;
                                    margin-right: 20px;
                                }
                                :nth-child(1){
                                    border-bottom: 2px solid rgb(255,89,1);
                                    margin-left: 30px;
                                }
                            }
                            p{
                                float: left;
                                width: 351px;
                                font-size: 14px;
                                margin-top: 10px;
                                margin-left: 20px;
                            }
                        }
                    }
                    .box1-1-bottom{
                        flex: 3;
                        width: 351px;
                        // display: flex;
                        // flex-direction: column;
                        .bottom1{
                            // flex: 1;
                            // display: flex;
                            width: 100%;
                            float: left;
                            .b1-1,.b1-2,.b1-3,.b1-4{
                                // flex: 1;
                                width: 80px;
                                float: left;
                                border: 1px solid rgb(231, 231, 231);
                                // border-right: none;
                                .chf{
                                    width: 100%;
                                    text-align: center;
                                    font-size: 12px;
                                    margin-bottom: 10px;
                                }
                                .p{
                                    width: 41px;
                                    height: 33px;
                                    background: url('../img/huafei.png') no-repeat;
                                    margin: 10px auto 5px;
                                }
                            }
                        }
                        .bottom2{
                            // flex: 1;
                            // display: flex;
                            width: 100%;
                            float: left;
                            .b2-1,.b2-2,.b2-3,.b2-4{
                                // flex: 1;
                                float: left;
                                width: 80px;
                                border: 1px solid rgb(231, 231, 231);
                                // border-right: none;
                                .chf{
                                    width: 100%;
                                    text-align: center;
                                    font-size: 12px;
                                    margin-bottom: 10px;
                                }
                                .p{
                                    width: 41px;
                                    height: 33px;
                                    background: url('../img/huafei.png') no-repeat;
                                    margin: 10px auto 5px;
                                }
                            }
                        }
                        .bottom3{
                            flex: 1;
                            margin-top: 2px;
                            .ali{
                                float: left;
                                font-size: 14px;
                                margin-left: 10px;
                            }
                            .more{
                                float: right;
                                font-size: 12px;
                                margin-right: 10px;
                            }
                            .pic-b{
                                width: 100%;
                                float: left;
                                padding: 0 20px;
                                margin-top: 5px;
                                .pic-b3{
                                    width: 40px;
                                    height: 40px;
                                    background: url('../img/taobao.png') no-repeat;
                                    float: left;
                                    margin-left: 20px;
                                }
                            }
                        }
                    }
                }
            }
            .box3{
                width: 100%;
                padding: 20px;
                box-sizing: border-box;
                overflow: hidden;
                float: left;
                h3{
                    width: 100%;
                    font-weight: normal;
                    float: left;
                    margin-bottom: 30px;
                    span{
                        float: left;
                        font-size: 26px;
                    }
                    i{
                        display: block;
                        float: left;
                        width: 82px;
                        height: 25px;
                        background: url('../img/koubei.png') no-repeat;
                        margin-left: 10px;
                        margin-top:5px;
                    }
                }
                .box3-1{
                    width: 270px;
                    float: left;
                    margin-right: 20px;
                    .pic3-1{
                        width: 270px;
                        height: 270px;
                        background-color: rgb(114,104,89);
                        border-radius: 15px;
                        margin-bottom: 20px;
                    }
                    .title{
                        width: 100%;
                        color: rgb(156, 156, 156);
                        padding-left: 10px;
                        height: 20px;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                    }
                    .dis{
                        width: 100%;
                        color: rgb(151, 151, 151);
                        padding-left: 10px;
                        height: 20px;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                    }
                }
                .box3-2{
                    width: 270px;
                    float: left;
                    margin-right: 20px;
                    .pic3-2{
                        width: 270px;
                        height: 270px;
                        background-color: rgb(114,104,89);
                        border-radius: 15px;
                        margin-bottom: 20px;
                    }
                    .title{
                        width: 100%;
                        color: rgb(156, 156, 156);
                        padding-left: 10px;
                        height: 20px;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                    }
                    .dis{
                        width: 100%;
                        color: rgb(151, 151, 151);
                        padding-left: 10px;
                        height: 20px;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                    }
                }
                .box3-3{
                    width: 270px;
                    float: left;
                    margin-right: 20px;
                    .pic3-3{
                        width: 270px;
                        height: 270px;
                        background-color: rgb(114,104,89);
                        border-radius: 15px;
                        margin-bottom: 20px;
                    }
                    .title{
                        width: 100%;
                        color: rgb(156, 156, 156);
                        padding-left: 10px;
                        height: 20px;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                    }
                    .dis{
                        width: 100%;
                        color: rgb(151, 151, 151);
                        padding-left: 10px;
                        height: 20px;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                    }
                }
                .box3-4{
                    width: 270px;
                    float: left;
                    margin-right: 20px;
                    .pic3-4{
                        width: 270px;
                        height: 270px;
                        background-color: rgb(114,104,89);
                        border-radius: 15px;
                        margin-bottom: 20px;
                    }
                    .title{
                        width: 100%;
                        color: rgb(156, 156, 156);
                        padding-left: 10px;
                        height: 20px;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                    }
                    .dis{
                        width: 100%;
                        color: rgb(151, 151, 151);
                        padding-left: 10px;
                        height: 20px;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                    }
                }
                .ad{
                    width: 100%;
                    float: left;
                    margin-top: 20px;
                    .box3-5,.box3-6,.box3-7{
                        width: 365px;
                        background-color: skyblue;
                        height: 100px;
                        border-radius: 20px;
                        margin-right: 20px;
                        float: left;
                    }
                }
                
            }
        }
    }
}